<template>
  <Xuanfu/>
  <Header/>
        
  <RouterView v-slot="{ Component }">
    <!-- 使用keep-alive组件，用于缓存动态组件  -->
    <!-- 据路由元数据中的keepAlive属性决定是否渲染组件 -->
    <!-- 如果路由元数据中的keepAlive属性为false，则直接渲染组件 -->
    <keep-alive>
      <component :is="Component" v-if="$route.meta.keepAlive" />
    </keep-alive>
    <component :is="Component" v-if="!$route.meta.keepAlive" />
  </RouterView>
</template>

<script setup>
import Xuanfu from '@/components/Xuanfu.vue' // 引入名为Header的组件
import Header from '@/components/Header.vue' // 引入名为Header的组件
import { computed, watch } from 'vue' // 从Vue库中导入computed和watch函数
import { RouterView } from 'vue-router' // 从Vue Router库中导入RouterView组件
import router from './router' // 引入名为router的路由实例

const isTabbarView = computed(() => router.currentRoute.value.path === '/tabBarView') // 判断当前路由是否为"/tabBarView"路径的计算属性
watch(isTabbarView, () => {}) // 监听isTabbarView的变化，空函数体


</script>
